<template>

    <div>
        <div>
            <van-row>
                <van-col span="24">
                    <van-icon id="fanhui" @click="tuichu()" name="cross" />
                </van-col>
            </van-row>
        </div>
        <div>
            <van-image style="width: 400px;height: 300px" :src="img"></van-image>
        </div>

        <div>
            <van-row>
                <van-col span="24">商品名称:{{name}}</van-col>
            </van-row>
        </div>
        <div>
            <van-row>
                <van-col span="24">商品价格: {{jiage}}$</van-col>
            </van-row>
        </div>
        <div>
            <van-row>
                <van-col span="24">商品详情:{{detil}}</van-col>
            </van-row>
        </div>

        <div>
            <van-stepper v-model="value" theme="round" button-size="22" disable-input />
        </div>


        <div id="dibu">
            <van-row>
                <van-col span="24">

                    <van-action-bar>
                        <van-action-bar-icon @click="kefu()" icon="chat-o" text="客服" color="#ee0a24" />

                        <van-action-bar-button @click="buy()" type="danger" text="立即购买" />
                    </van-action-bar>

                </van-col>
            </van-row>
        </div>
    </div>

</template>

<script>
    import { Toast } from 'vant';
    export default {
        name: "ShoppingDetail",
        data(){
            return{
                name:"",
                img:"",
                jiage:0,
                detil:"",
                value:1,
                ids:0
            }
        },
        methods:{
            tuichu(){
                history.back();
            },
            buy(){
                var zongjia = this.value * this.jiage
                this.$router.push({path:"/address",query:{money:zongjia,name:this.name,count:this.value,id:this.ids}})
            },
            kefu(){
                this.$router.push({path:"/foodChat"})
            }
        },

        mounted(){
            var shoppingnames=this.$route.query.shoppingnames
            var shoppingimg=this.$route.query.shoppingimg
            var shoppingpricenow=this.$route.query.shoppingpricenow
            var ids=this.$route.query.ids
            console.log(shoppingnames)
            this.name=shoppingnames
            this.img=shoppingimg
            this.jiage=shoppingpricenow
            this.ids=ids

            console.log(this.prices)
            var that = this
            this.axios.post("http://localhost:8081/api/shoppingdetails/details.do",{

                "shoppingnames":this.name
            })
                .then(function (res) {

                    if (res.data.code==200){
                        that.detil=res.data.data.shoppingdetail

                    }else {
                        Toast("网络异常，请重试")
                    }
                })


        }
    }
</script>

<style scoped>

    #dibu{
        bottom: 0;
    }
</style>